﻿

<div style="padding: 16px">
    <div class="layui-card" style="height: 800px;">
        <div class="layui-card-body" style="height: max-content;">
            <h3>服务添加</h3>

            <form class="layui-form" action="" style="margin-left: 100px; margin-right: 100px;">
                <!-- 第一行：3个字段 -->
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-md4">
                        <div class="layui-form-item">
                            <label class="layui-form-label">服务名称:</label>
                            <div class="layui-input-block">
                                <input type="text" name="ServiceName" required lay-verify="required" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md4">
                        <div class="layui-form-item">
                            <label class="layui-form-label">服务价格:</label>
                            <div class="layui-input-block">
                                <input type="number" name="ServicePrice" required lay-verify="required|number" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-md4">
                        <div class="layui-form-item">
                            <label class="layui-form-label">起始周:</label>
                            <div class="layui-input-block">
                                <input type="number" name="SerStartTime" required lay-verify="required|number" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                    </div>


                    <!-- 第二行：3个字段 -->
                    <div class="layui-row layui-col-space15">
                        <div class="layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label">服务间隔:</label>
                                <div class="layui-input-block">
                                    <input type="number" name="ServiceInterval" lay-verify="number" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label">阈值:</label>
                                <div class="layui-input-block">
                                    <input type="number" name="ServiceThreshold" lay-verify="number" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label">服务次数:</label>
                                <div class="layui-input-block">
                                    <input type="number" name="ServiceCount" lay-verify="number" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                        </div>
                        <div class="layui-col-md4">
                            <div class="layui-form-item">
                                <label class="layui-form-label">服务类型:</label>
                                <div class="layui-input-block">
                                    <select name="ServiceType" lay-verify="required">
                                        <option value="0">宝宝</option>
                                        <option value="1">美容</option>
                                        <option value="2">护理</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    @*<div class="layui-col-md4"></div>*@


                    <!-- 提交按钮 -->
                    <div class="layui-form-item">
                        <div class="layui-input-block" style="text-align: center;">
                            <button type="submit" class="layui-btn" lay-submit lay-filter="demo1">立即提交</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script src="~/Assets/bootstrap/js/jquery-1.10.2.min.js"></script>
<script src="/Assets/hplus-admin/js/plugins/peity/jquery.peity.min.js"></script>
<script src="~/Assets/layui/layui.js"></script>

<script>
    layui.use(['form', 'laydate', 'layer', 'jquery'], function () {
        var form = layui.form;
        var layer = layui.layer;
        var $ = layui.jquery;

        // 自定义验证规则
        form.verify({
            serviceName: function (value) {
                if (value.length < 2) {
                    return '服务名称至少2个字符';
                }
            },
            servicePrice: function (value) {
                if (value <= 0) {
                    return '服务价格必须大于0';
                }
            },
            serStartTime: function (value) {
                if (value < 1 || value > 52) {
                    return '起始周必须是1-52之间的数字';
                }
            }
        });

        // 表单提交
        form.on('submit(demo1)', function (data) {
            console.log("表单提交数据:", data.field); // 调试日志

            var btn = $('.layui-btn[lay-filter="demo1"]');
            if (btn.hasClass('layui-btn-disabled')) {
                return false;
            }
            btn.addClass('layui-btn-disabled');

            var loadIndex = layer.load(1, { shade: [0.5, '#000'] });

            $.ajax({
                url: '/ServiceList/DataInsert',
                type: 'POST',
                contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
                data: data.field,
                success: function (res) {
                    layer.close(loadIndex);
                    if (res.code === 0) {
                        layer.msg(res.msg, { icon: 1 }, function () {
                            // 刷新父页面表格
                            if (parent.layui.table) {
                                parent.layui.table.reload('testselist');
                            }
                            // 关闭当前弹层
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                        });
                    } else {
                        layer.msg(res.msg || '添加失败', { icon: 2 });
                    }
                    btn.removeClass('layui-btn-disabled');
                },
                error: function (xhr, status, error) {
                    layer.close(loadIndex);
                    layer.msg('请求失败: ' + error, { icon: 2 });
                    btn.removeClass('layui-btn-disabled');
                }
            });

            return false; // 阻止表单默认提交
        });
    });

</script>
